import React, { Component } from 'react';
import MemoryUtils from '../utils/MemoryUtils';
import { Card, Button, Table, message } from 'antd';
import { PlusOutlined } from '@ant-design/icons';
import '../css/recommend.css';
import LinkButton from './LinkButton';

export default class Recommend extends Component {
    state = {
        loading: false,
        articalList: [],
    }

    initColumns = () => {
        this.columns = [
            {
                title: '文章名称',
                dataIndex: 'content_title',
            },
            {
                title: '发布时间',
                dataIndex: 'content_time',
            },
            {
                title: '操作',
                width: 300,
                render: (obj1) =>
                    <span>
                        <LinkButton
                            onClick={() => {
                                MemoryUtils.artical = obj1;
                                this.props.history.push('/recommend/detail')
                            }} >详情</LinkButton>
                        <LinkButton onClick={() => {
                            fetch('http://82.157.94.115:2005/deletecontent', {
                                method: 'POST',
                                body: JSON.stringify(obj1),
                                headers: {
                                    'Content-Type': 'application/json;charset=utf-8'
                                }
                            })
                                .then(res => res.json())
                                .then(res => {
                                    message.success('删除成功！')
                                    this.getArticals();
                                })
                                .catch(error => {
                                    message.error('删除失败！')
                                })
                        }}>删除</LinkButton>
                    </span>
                
            },
        ]
    }

    getArticals = () => {
        fetch('http://82.157.94.115:2005/content')
            .then(res => res.json())
            .then(res => {
                this.setState({ articalList: res.obj1 });
            })
    }

    componentWillMount() {
        this.initColumns();
    }

    componentDidMount() {
        this.getArticals();
    }


    render() {
        const { articalList, loading } = this.state;
        const extra = (
            <Button type='primary' onClick={() => {
                this.props.history.push('/recommend/addartical')
            }}>
                <PlusOutlined />
                添加
            </Button>
        )
        return (
            <div>
                <Card extra={extra} >
                    <Table
                        bordered={true}
                        columns={this.columns}
                        loading={loading}
                        dataSource={articalList}
                        pagination={{ defaultPageSize: 10, showQuickJumper: true }}
                    />
                </Card>
            </div>
        )
    }
}
